<template>
  <div class="info-header">
    <div class="info-header-headimg">
      <img src="@/assets/head_img.png"/>
    </div>
    <div class="info-header-nav">
      <div class="nav-info active">消息</div>
      <div class="nav-call">通话</div>
    </div>
    <div class="info-header-btn">
      <a class="header-btn-icon" href="#">
        <img src="@/assets/header_btn.png"/>
      </a>
    </div>
  </div>
</template>

<script>
export default {
}
</script>

<style scoped lang="stylus">
  .info-header
    position:fixed
    top:0
    left:0
    z-index:999
    display:flex
    flex-direction:row
    align-items:center
    justify-content:space-between
    height:2.282667rem
    width:100%
    padding:0 .469333rem
    box-sizing:border-box
    background:#13acf0
    .info-header-headimg
      img
        width:1.493333rem
        height:1.493333rem
        vertical-align:middle
    .info-header-nav
      display:flex
      width:5.034667rem
      height:1.6rem
      line-height:1.6rem
      text-align:center
      border-radius:5px
      background:#4bc4fb
      color:#1489be
      font-size:16px
      div
        flex:1
      .active
        background:#0f84b9
        color:white
        border-radius:5px 0 0 5px
    .info-header-btn
      .header-btn-icon
        display:block
        img
          height:1.536rem
          width:1.536rem
          vertical-align:middle

</style>
